<!DOCTYPE html >
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>高校科研创新服务平台</title>

    <link rel="stylesheet" type="text/css" href="/static/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/static/fonts/line-icons.css">
    <link href="/static/plugins/datatables/dataTables.bootstrap4.min.css" rel="stylesheet" type="text/css" />
    <link href="/static/plugins/datatables/buttons.bootstrap4.min.css" rel="stylesheet" type="text/css" />
    <link href="/static/plugins/datatables/responsive.bootstrap4.min.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" type="text/css" href="/static/css/main.css">
    <link rel="stylesheet" type="text/css" href="/static/css/responsive.css">

    <script src="https://code.highcharts.com.cn/highcharts/highcharts.js"></script>
    <script src="https://code.highcharts.com.cn/highcharts/modules/exporting.js"></script>
    <script src="https://code.highcharts.com.cn/highcharts/modules/drilldown.js"></script>
    <script src="https://img.hcharts.cn/highcharts-plugins/highcharts-zh_CN.js"></script>

    <script src="/static/js/jquery.app.js"></script>
    <script src="/static/js/jquery-min.js"></script>
    <script src="/static/plugins/datatables/jquery.dataTables.min.js"></script>

</head>
<body>
<div class="app header-default side-nav-dark">
    <div class="layout">
        <!--顶部栏-->
        <div th:replace="~{/topbar::topbar}">
        </div>
        <!--侧边栏-->
        <div th:replace="~{/sidebar::sidebar}">
        </div>
        <!--主体部分-->
        <div class="page-container">

            <div class="main-content">
                <div class="container-fluid">

                    <div class="breadcrumb-wrapper row">
                        <div class="col-12 col-lg-3 col-md-6">
                            <!--<h4 class="page-title">研究机构</h4>-->
                        </div>
                        <!--
                        <div class="col-12 col-lg-9 col-md-6">
                            <ol class="breadcrumb float-right">
                                <li><a href="#">Tables</a></li>
                                <li class="active"> / Data Table</li>
                            </ol>
                        </div>
                        -->
                    </div>

                </div>
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="row row-margin-top">
                                <div class="col-md-1">
                                </div>
                                <div class="col-md-10">
                                    <input type="hidden" id="pNumy" th:value="${pNumy}">
                                    <input type="hidden" id="uNumy" th:value="${uNumy}">
                                    <input type="hidden" id="imNumy" th:value="${imNumy}">
                                    <input type="hidden" id="cNumy" th:value="${cNumy}">
                                    <input type="hidden" id="totalNum" th:value="${totalNum}">
                                    <input type="hidden" id="totalNum1" th:value="${totalNum1}">
                                    <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
                                    <script>
                                        var pnumy = $('#pNumy').val();
                                        var unumy = $('#uNumy').val();
                                        var imnumy = $('#imNumy').val();
                                        var cnumy = $('#cNumy').val();
                                        var totalNum = $('#totalNum').val();
                                        var totalNum1 = $('#totalNum1').val();
                                        Highcharts.chart('container', {
                                            chart: {
                                                type: 'column'
                                            },
                                            title: {
                                                text: '2021年1-6月数据'
                                            },
                                            xAxis: {
                                                type: 'category'
                                            },
                                            yAxis: {
                                                title: {
                                                    text: ''
                                                }
                                            },
                                            legend: {
                                                enabled: false
                                            },
                                            plotOptions: {
                                                series: {
                                                    borderWidth: 0,
                                                    dataLabels: {
                                                        enabled: true,
                                                        format: '{point.y:.1f}项/万'
                                                    }
                                                }
                                            },
                                            tooltip: {
                                                headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
                                                pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}项/万</b> of total<br/>'
                                            },
                                            series: [{
                                                name: '',
                                                colorByPoint: true,
                                                data: [{
                                                    name: '科研队伍',
                                                    y: Number(unumy)
                                                    // drilldown: '科研队伍'
                                                }, {
                                                    name: '纵向项目',
                                                    y: Number(pnumy)
                                                }, {
                                                    name: '横向项目',
                                                    y: Number(cnumy)
                                                }, {
                                                    name: '科研经费',
                                                    y: Number(imnumy)
                                                }, {
                                                    name: '科研成果',
                                                    y: Number(totalNum)
                                                }, {
                                                    name: '知识产权',
                                                    y: Number(totalNum1)
                                                }]
                                            }]
                                        }); // JS 代码
                                    </script>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>



                <footer class="content-footer">
                    <div th:replace="~{/footer::footer}"></div>
                </footer>

            </div>

        </div>
    </div>
</div>
<script src="/static/js/jquery-min.js"></script>
<script src="/static/js/popper.min.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<script src="/static/js/scripts.js"></script>
<script src="/static/js/jquery.app.js"></script>
<script src="/static/js/main.js"></script>

<script src="/static/plugins/datatables/jquery.dataTables.min.js"></script>
<script src="/static/plugins/datatables/dataTables.bootstrap4.min.js"></script>

<script src="/static/plugins/datatables/dataTables.buttons.min.js"></script>
<script src="/static/plugins/datatables/buttons.bootstrap4.min.js"></script>
<script src="/static/plugins/datatables/jszip.min.js"></script>
<script src="/static/plugins/datatables/pdfmake.min.js"></script>
<script src="/static/plugins/datatables/vfs_fonts.js"></script>
<script src="/static/plugins/datatables/buttons.html5.min.js"></script>
<script src="/static/plugins/datatables/buttons.print.min.js"></script>
<script src="/static/plugins/datatables/buttons.colVis.min.js"></script>

<script src="/static/plugins/datatables/dataTables.responsive.min.js"></script>
<script src="/static/plugins/datatables/responsive.bootstrap4.min.js"></script>

<script src="/static/js/datatables.init.js"></script>
</body>
</html>